/**
 * PageShareContent
 */

import React, {Component} from 'react';
import { connect } from 'dva';
import { bindActionCreators } from 'redux';
import pageJumpActions from '../../../actions/Editor/pageJump';
import editorActions from '../../../actions/Editor/editor';
import tool from "../../../utils/tool";
import consts from "../../../utils/consts";
import storage from "../../../utils/storage";
import CommonProperty from "./CommonProperty";

class PageShareContent extends Component{
    mixins: [CommonProperty]
    handleOnTextChanged(type, e){
        let element = $(e.target);
        let title = element.val();
        let param = {};
        param[type] = title;
        this.updatePageData(param);
    }
    handleOnInputBlur(type, e){

//        const {pageJump} = this.props;
//
//        pageJump[type] = this.state[type];
//
//        this.updatePageData(pageJump);
    }
    updatePageData(pageJump){
        const {updatePageJump} = this.props;
        updatePageJump(pageJump);
    }
    handleOnStartUpload(type){
        const {setState} = this.props;
        let param = {};
        let sharedTypes = {
            0: "is_picture_shared_url",
            1: "is_h5_shared_url"
        };

        param[sharedTypes[type]] = true;
        setState(param);
        console.log("open dialog");
//        root.openDialog(consts.DIALOG_TYPE.UPLOAD_PICTURE);
    }
    handleOnCancelUpload(){
        this.helper.cancelUpload();
    }
    handleOnChangeSharedType(type, val){
        let param = {};
        param[type] = val;
        this.updatePageData(param);
    }
    render(){
        const {pageJump} = this.props;
        const {h5_shared_url,picture_shared_url,h5_shared_switch,picture_shared_title,h5_shared_title,video_shared_title} = pageJump;
        let contentNode = "";
        // 分享图片
        if (h5_shared_switch === 0){
            contentNode =
                <div>
                    <div className="rowlist">
                        <div>分享图片</div>
                        <div className="shareIme">
                            <div onClick={ () => this.handleOnStartUpload(h5_shared_switch) } style={{ backgroundImage:"url(" + picture_shared_url + ")" }}>
                                <input type="file" style={{ display: "none" }} accept=".png,.jpg,.jpeg,.PNG,.JPG,.JPEG" />
                            </div>
                        </div>
                        <div className="shareImgTip">上传小于640*640的jpg,png图片</div>
                        <div id="logo_upload_error"></div>
                    </div>
                    <div className="rowlist shareTitle">
                        <div>分享文案</div>
                        <textarea placeholder="填写分享图片文案；不填则使用默认文案" className="sharetitle form-control page-item" value={ picture_shared_title } name="picture_shared_title" onChange={ (e) => this.handleOnTextChanged("picture_shared_title",e) } onBlur={ this.handleOnInputBlur(this, "picture_shared_title") }></textarea>
                    </div>
                </div>
        // 分享H5
        } else if(h5_shared_switch === 1) {
            contentNode =
                <div>
                    <div className="rowlist">
                        <div>H5微信分享图标</div>
                        <div className="shareIme">
                            <div onClick={ () => this.handleOnStartUpload(h5_shared_switch) } style={{ backgroundImage:"url(" + h5_shared_url + ")" }}>
                                <input type="file" style={{ display: "none" }} accept=".png,.jpg,.jpeg,.PNG,.JPG,.JPEG" />
                            </div>
                        </div>
                        <div className="shareImgTip">上传小于480*480的jpg,png图片</div>
                        <div id="logo_upload_error"></div>
                    </div>
                    <div className="rowlist shareTitle">
                        <div>H5微信分享标题</div>
                        <textarea placeholder="填写微信分享标题文案；不填则使用默认文案" className="sharetitle form-control page-item" value={ h5_shared_title } name="h5_shared_title" onChange={ (e) => this.handleOnTextChanged("h5_shared_title",e) } onBlur={ () => this.handleOnInputBlur("h5_shared_title") }></textarea>
                    </div>
                </div>
        }

        return (
            <div className="H5share">
                <div className="rowlist">
                    <span>APP默认分享类型设置</span>
                    <div className="standard">
                        <div onClick={ () => this.handleOnChangeSharedType("h5_shared_switch",0) } className={"page-item " + (h5_shared_switch === 0 ? "activebtn" : "noactivebtn")}>
                            <span>分享图片</span>
                        </div>
                        <div onClick={ () => this.handleOnChangeSharedType("h5_shared_switch",1) } className={"page-item " + (h5_shared_switch === 1 ? "activebtn" : "noactivebtn")}>
                            <span>分享H5</span>
                        </div>
                    </div>
                </div>
                { contentNode }
                <div className="rowlist video-share">
                    <span>录制AR视频分享文案</span>
                    <textarea placeholder="填写视频分享文案；不填则使用默认文案" className="sharetitle form-control page-item" value={video_shared_title} name="video_shared_title" onChange={ (e) => this.handleOnTextChanged("video_shared_title",e) } onBlur={() => this.handleOnInputBlur("video_shared_title") }></textarea>
                </div>
            </div>
        )
    }
 }

 const mapStateToProps = ({ editor }) => {
     return editor;
};

const mapDispatchToProps = (dispatch) => {
  return bindActionCreators({...pageJumpActions,...editorActions}, dispatch);
};


export default connect(mapStateToProps, mapDispatchToProps)(PageShareContent);
